<template>
    <view class="p-20">
        <z-paging ref="paging" v-model="dataList" use-page-scroll @query="queryList">
            <template #refresher="{refresherStatus}">
                <custom-refresher :status="refresherStatus" />
            </template>
            <template #loadingMoreNoMore>
                <custom-nomore />
            </template>

            <view class="" v-for="(item,index) in dataList" :key="index">
                <view class="bg-white p-30 flex col-center row-between m-b-20 box_shadow br12">
                    <view class="">
                        <view class="bold x">
                            商品编号:{{item.productNo}}
                        </view>
                        <view class="m-t-20 xs">
                            是否放入二手仓库：<uni-tag v-if="item.status == 0" type="warning" text="未入库" size="mini" />
                            <uni-tag v-if="item.status == 1" type="success" text="已入库" size="mini" />
                        </view>
                    </view>
                    <view class="">
                        <u-tag text="编辑" type="primary" @click="openPopup(item)"></u-tag>
                    </view>
                </view>
            </view>
            <u-popup v-model="showPopup" mode="right" length="80%">
                <view class="p-20">
                    <uni-forms :model="goodsInfo">
                        <uni-forms-item label="商品编号">
                            <uni-easyinput disabled v-model="goodsInfo.productNo" type="text" border="none" />
                        </uni-forms-item>
                        <uni-forms-item label="商品名称">
                            <uni-easyinput v-model="goodsInfo.productName" type="text" border="none"
                                placeholder="请输入商品名称" />
                        </uni-forms-item>
                        <uni-forms-item label="品牌">
                            <uni-data-select v-model="goodsInfo.brand" :localdata="brandList"></uni-data-select>
                        </uni-forms-item>
                        <uni-forms-item label="单位">
                            <uni-easyinput v-model="goodsInfo.unit" type="text" border="none" placeholder="请输入单位" />
                        </uni-forms-item>
                        <uni-forms-item label="采购价格">
                            <uni-easyinput v-model="goodsInfo.procurementPrice" type="number" border="none"
                                placeholder="请输入采购价格" />
                        </uni-forms-item>
                        <uni-forms-item label="采购库存">
                            <uni-easyinput v-model="goodsInfo.procurementInventory" type="number" border="none"
                                placeholder="请输入采购库存" />
                        </uni-forms-item>
                        <uni-forms-item label="是否放入二手仓库">
                            <uni-tag v-if="goodsInfo.status == 0" type="warning" text="未入库" />
                            <uni-tag v-if="goodsInfo.status == 1" type="success" text="已入库" />
                        </uni-forms-item>
                    </uni-forms>
                    <view class="flex row-around">
                        <u-button @click="showPopup = false">取消</u-button>
                        <u-button type="primary" @click="editData(goodsInfo)">保存</u-button>
                    </view>
                </view>
            </u-popup>
        </z-paging>
    </view>
</template>

<script setup>
    import {
        apiUpdatePurchaseGoodsStore,
        apiGetPurchaseGoodsStore,
        apiGetAllBrand
    } from '@/api/index.js'
    import {
        ref
    } from 'vue'
    import {
        onLoad
    } from '@dcloudio/uni-app'
    import {
        onPageScroll,
        onReachBottom
    } from '@dcloudio/uni-app';
    import useZPaging from "@/uni_modules/z-paging/components/z-paging/js/hooks/useZPaging.js";

    const dataList = ref([])
    const brandList = ref([])
    const paging = ref(null)
    const showPopup = ref(false)
    const goodsInfo = ref({})


    const openPopup = (item) => {
        showPopup.value = true
        goodsInfo.value = item
    }

    const queryList = (pageNo, pageSize) => {
        const params = {
            current: pageNo,
            pageSize: pageSize,
        }
        apiGetPurchaseGoodsStore(params).then(res => {
            paging.value.complete(res.data.records);
        }).catch(res => {
            paging.value.complete(false);
        })
    }
    //获取全部分类
    const getAllBrandList = () => {
        apiGetAllBrand().then(res => {
            brandList.value = res.data.map(item => {
                return {
                    text: item.brandName,
                    value: item.id
                }
            })
        })
    }

    const editData = async (params) => {
        try {
            let res = await apiUpdatePurchaseGoodsStore(params)
            if (res.code == 200) {
                uni.$u.toast('编辑成功')
                setTimeout(() => {
                    showPopup.value = false
                }, 1000)
            } else {
                uni.$u.toast('编辑失败')
            }
        } catch (err) {

        }
    }

    useZPaging(paging)

    onLoad(() => {
        getAllBrandList()
    })
</script>